<template>
	<header class="lk-sy-header">
		<div class="lk-sy-header-count">
			<div class="lk-sy-header-count-left"><span>所在城市:<a href="">哈密市伊州区</a></span><i></i></div>
			<div class="lk-sy-header-count-right">
				<ul>
					<li>
						<a href="#/dl" >{{arr1}}</a>
					</li>
					<li>
						<a href="#/zc" >{{arr2}}</a>
					</li>
					<li>
						<a href="#/centerinfo">{{arr3}}</a>
					</li>
					<li>
						<a href="#/myNews">{{arr4}}</a>
					</li>
					<li>
						<a href="#/wssj">{{arr5}}</a>
					</li>
				</ul>
				<i></i>
				<span>0902-2511011</span>
			</div>
		</div>
	</header>
</template>

<script>
	export default {
		name: 'hed',
		data() {
			return {
				arr1: '登录',
				arr2: '注册',
				arr3: '我的订单',
				arr4: '我的消息',
				arr5: '我是商家'
			}
		},

	}
</script>

<style>
	.lk-sy-header {
		height: 35px;
		background-color: rgb(234, 234, 234);
	}

	.lk-sy-header-count {
		width: 1280px;
		margin: 0 auto;
		line-height: 35px;
	}

	.lk-sy-header-count a {
		color: black;
		font-size: 14px;
	}

	.lk-sy-header-count-left {
		float: left;
		font-size: 14px;
	}

	.lk-sy-header-count-left a {
		padding-left: 2px;
	}

	.lk-sy-header-count-left>i {
		display: inline-block;
		width: 9px;
		vertical-align: middle;
		height: 35px;
		background-image: url(../assets/xia.png);
		background-repeat: no-repeat;
		background-position: center center;
		padding-left: 2px;
	}

	.lk-sy-header-count-right {
		float: right;
	}

	.lk-sy-header-count-right>ul {
		display: inline-block;
	}

	.lk-sy-header-count-right>ul>li {
		display: inline-block;
	}

	.lk-sy-header-count-right a {
		padding: 0 10px;
		border-right: 1px solid #999;
	}

	.lk-sy-header-count-right>i {
		display: inline-block;
		width: 17px;
		height: 17px;
		background-image: url(../assets/phone.png);
		background-position: center center;
		background-repeat: no-repeat;
		vertical-align: middle;
		margin-left: 10px;
	}

	.lk-sy-header-count-right>span {
		font-size: 13px;
		font-weight: 500;
	}
</style>
